
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <script src="iconfont.js"></script>

    <style type="text/css">
        .icon {
          /* 通过设置 font-size 来改变图标大小 */
          width: 1em; height: 1em;
          /* 图标和文字相邻时，垂直对齐 */
          vertical-align: -0.15em;
          /* 通过设置 color 来改变 SVG 的颜色/fill */
          fill: currentColor;
          /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
             normalize.css 中也包含这行 */
          overflow: hidden;
        }

    </style>
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-appreciate"></use>
                    </svg>
                    <div class="name">appreciate</div>
                    <div class="fontclass">#nj-appreciate</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-commentfill"></use>
                    </svg>
                    <div class="name">comment_fill</div>
                    <div class="fontclass">#nj-commentfill</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-comment"></use>
                    </svg>
                    <div class="name">comment</div>
                    <div class="fontclass">#nj-comment</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiala"></use>
                    </svg>
                    <div class="name">下拉</div>
                    <div class="fontclass">#nj-xiala</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiashi"></use>
                    </svg>
                    <div class="name">加湿</div>
                    <div class="fontclass">#nj-jiashi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhileng"></use>
                    </svg>
                    <div class="name">制冷</div>
                    <div class="fontclass">#nj-zhileng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-paizhao"></use>
                    </svg>
                    <div class="name">拍照</div>
                    <div class="fontclass">#nj-paizhao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gou"></use>
                    </svg>
                    <div class="name">勾</div>
                    <div class="fontclass">#nj-gou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-icon"></use>
                    </svg>
                    <div class="name">退出</div>
                    <div class="fontclass">#nj-icon</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yuyin"></use>
                    </svg>
                    <div class="name">语音</div>
                    <div class="fontclass">#nj-yuyin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-weixinzhifu2"></use>
                    </svg>
                    <div class="name">微信支付2</div>
                    <div class="fontclass">#nj-weixinzhifu2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-ditu"></use>
                    </svg>
                    <div class="name">地图</div>
                    <div class="fontclass">#nj-ditu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-canyin-copy"></use>
                    </svg>
                    <div class="name">餐饮</div>
                    <div class="fontclass">#nj-canyin-copy</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gantanhao"></use>
                    </svg>
                    <div class="name">感叹号</div>
                    <div class="fontclass">#nj-gantanhao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-vip"></use>
                    </svg>
                    <div class="name">会员卡</div>
                    <div class="fontclass">#nj-vip</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiantou-copy-copy"></use>
                    </svg>
                    <div class="name">箭头</div>
                    <div class="fontclass">#nj-jiantou-copy-copy</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tishi1"></use>
                    </svg>
                    <div class="name">提示</div>
                    <div class="fontclass">#nj-tishi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-ego-hot"></use>
                    </svg>
                    <div class="name">热度</div>
                    <div class="fontclass">#nj-ego-hot</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-Telephone"></use>
                    </svg>
                    <div class="name">电话</div>
                    <div class="fontclass">#nj-Telephone</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-icongroup06"></use>
                    </svg>
                    <div class="name">邀请好友</div>
                    <div class="fontclass">#nj-icongroup06</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shibai"></use>
                    </svg>
                    <div class="name">失败</div>
                    <div class="fontclass">#nj-shibai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-chushi"></use>
                    </svg>
                    <div class="name">除湿</div>
                    <div class="fontclass">#nj-chushi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-mendian2"></use>
                    </svg>
                    <div class="name">门店</div>
                    <div class="fontclass">#nj-mendian2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-icon09"></use>
                    </svg>
                    <div class="name">制热</div>
                    <div class="fontclass">#nj-icon09</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-bofang"></use>
                    </svg>
                    <div class="name">播放</div>
                    <div class="fontclass">#nj-bofang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tongxunlu"></use>
                    </svg>
                    <div class="name">通讯录</div>
                    <div class="fontclass">#nj-tongxunlu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fasong"></use>
                    </svg>
                    <div class="name">发送</div>
                    <div class="fontclass">#nj-fasong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-youjianyouxiang"></use>
                    </svg>
                    <div class="name">邮件 邮箱</div>
                    <div class="fontclass">#nj-youjianyouxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenxiang2"></use>
                    </svg>
                    <div class="name">分享</div>
                    <div class="fontclass">#nj-fenxiang2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yiqiangwan"></use>
                    </svg>
                    <div class="name">已抢完</div>
                    <div class="fontclass">#nj-yiqiangwan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-chenggong"></use>
                    </svg>
                    <div class="name">成功</div>
                    <div class="fontclass">#nj-chenggong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tupian1"></use>
                    </svg>
                    <div class="name">图片</div>
                    <div class="fontclass">#nj-tupian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fuzhuang"></use>
                    </svg>
                    <div class="name">服装</div>
                    <div class="fontclass">#nj-fuzhuang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-appreciate_fill_light"></use>
                    </svg>
                    <div class="name">appreciate_fill_light</div>
                    <div class="fontclass">#nj-appreciate_fill_light</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tupian"></use>
                    </svg>
                    <div class="name">图片</div>
                    <div class="fontclass">#nj-tupian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-suoxiao"></use>
                    </svg>
                    <div class="name">缩小</div>
                    <div class="fontclass">#nj-suoxiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fangda"></use>
                    </svg>
                    <div class="name">放大</div>
                    <div class="fontclass">#nj-fangda</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-baoguofahuo"></use>
                    </svg>
                    <div class="name">02包裹、发货</div>
                    <div class="fontclass">#nj-baoguofahuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gonggao1"></use>
                    </svg>
                    <div class="name">公告</div>
                    <div class="fontclass">#nj-gonggao1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-quanping"></use>
                    </svg>
                    <div class="name">全屏</div>
                    <div class="fontclass">#nj-quanping</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiaoxi1"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#nj-xiaoxi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-bag"></use>
                    </svg>
                    <div class="name">bag-购物袋</div>
                    <div class="fontclass">#nj-bag</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daisonghuo"></use>
                    </svg>
                    <div class="name">待送货</div>
                    <div class="fontclass">#nj-daisonghuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-biaoqing"></use>
                    </svg>
                    <div class="name">表情</div>
                    <div class="fontclass">#nj-biaoqing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhifubao1"></use>
                    </svg>
                    <div class="name">支付宝</div>
                    <div class="fontclass">#nj-zhifubao1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-weizhi"></use>
                    </svg>
                    <div class="name">位置</div>
                    <div class="fontclass">#nj-weizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tongzhi1"></use>
                    </svg>
                    <div class="name">通知</div>
                    <div class="fontclass">#nj-tongzhi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fan"></use>
                    </svg>
                    <div class="name">风机</div>
                    <div class="fontclass">#nj-fan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kongtiao"></use>
                    </svg>
                    <div class="name">空调</div>
                    <div class="fontclass">#nj-kongtiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-huiyuan"></use>
                    </svg>
                    <div class="name">会员</div>
                    <div class="fontclass">#nj-huiyuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-diannao"></use>
                    </svg>
                    <div class="name">电脑</div>
                    <div class="fontclass">#nj-diannao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shouji"></use>
                    </svg>
                    <div class="name">手机</div>
                    <div class="fontclass">#nj-shouji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-logo"></use>
                    </svg>
                    <div class="name">logo</div>
                    <div class="fontclass">#nj-logo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-suneee"></use>
                    </svg>
                    <div class="name">suneee</div>
                    <div class="fontclass">#nj-suneee</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tishi"></use>
                    </svg>
                    <div class="name">提示</div>
                    <div class="fontclass">#nj-tishi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-bianji"></use>
                    </svg>
                    <div class="name">编辑</div>
                    <div class="fontclass">#nj-bianji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cuxiaohuodong"></use>
                    </svg>
                    <div class="name">促销活动</div>
                    <div class="fontclass">#nj-cuxiaohuodong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-caidan"></use>
                    </svg>
                    <div class="name">菜单</div>
                    <div class="fontclass">#nj-caidan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-chongzhi"></use>
                    </svg>
                    <div class="name">充值</div>
                    <div class="fontclass">#nj-chongzhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-caigou"></use>
                    </svg>
                    <div class="name">采购</div>
                    <div class="fontclass">#nj-caigou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cuxiao"></use>
                    </svg>
                    <div class="name">促销</div>
                    <div class="fontclass">#nj-cuxiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daipeisong"></use>
                    </svg>
                    <div class="name">待配送</div>
                    <div class="fontclass">#nj-daipeisong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daifukuan"></use>
                    </svg>
                    <div class="name">待付款</div>
                    <div class="fontclass">#nj-daifukuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daifukuan1"></use>
                    </svg>
                    <div class="name">待付款1</div>
                    <div class="fontclass">#nj-daifukuan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daipeisong1"></use>
                    </svg>
                    <div class="name">待配送1</div>
                    <div class="fontclass">#nj-daipeisong1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daipingjia"></use>
                    </svg>
                    <div class="name">待评价</div>
                    <div class="fontclass">#nj-daipingjia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dengdai"></use>
                    </svg>
                    <div class="name">等待</div>
                    <div class="fontclass">#nj-dengdai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dizhi"></use>
                    </svg>
                    <div class="name">地址</div>
                    <div class="fontclass">#nj-dizhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daipingjia1"></use>
                    </svg>
                    <div class="name">待评价1</div>
                    <div class="fontclass">#nj-daipingjia1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-diwen"></use>
                    </svg>
                    <div class="name">低温</div>
                    <div class="fontclass">#nj-diwen</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fanhui"></use>
                    </svg>
                    <div class="name">返回</div>
                    <div class="fontclass">#nj-fanhui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenlei"></use>
                    </svg>
                    <div class="name">分类</div>
                    <div class="fontclass">#nj-fenlei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fanxian"></use>
                    </svg>
                    <div class="name">返现</div>
                    <div class="fontclass">#nj-fanxian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dianhua"></use>
                    </svg>
                    <div class="name">电话</div>
                    <div class="fontclass">#nj-dianhua</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenxiang"></use>
                    </svg>
                    <div class="name">分享</div>
                    <div class="fontclass">#nj-fenxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenleichazhao"></use>
                    </svg>
                    <div class="name">分类查找</div>
                    <div class="fontclass">#nj-fenleichazhao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fukuanma"></use>
                    </svg>
                    <div class="name">付款码</div>
                    <div class="fontclass">#nj-fukuanma</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gengduo"></use>
                    </svg>
                    <div class="name">更多</div>
                    <div class="fontclass">#nj-gengduo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gonggao"></use>
                    </svg>
                    <div class="name">公告</div>
                    <div class="fontclass">#nj-gonggao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gengduode"></use>
                    </svg>
                    <div class="name">更多的</div>
                    <div class="fontclass">#nj-gengduode</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouxuan"></use>
                    </svg>
                    <div class="name">勾选</div>
                    <div class="fontclass">#nj-gouxuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouwuche"></use>
                    </svg>
                    <div class="name">购物车</div>
                    <div class="fontclass">#nj-gouwuche</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouwuquan"></use>
                    </svg>
                    <div class="name">购物券</div>
                    <div class="fontclass">#nj-gouwuquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-guanbi"></use>
                    </svg>
                    <div class="name">关闭</div>
                    <div class="fontclass">#nj-guanbi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-guanzhu"></use>
                    </svg>
                    <div class="name">关注</div>
                    <div class="fontclass">#nj-guanzhu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gongxiang"></use>
                    </svg>
                    <div class="name">共享</div>
                    <div class="fontclass">#nj-gongxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-haoyou"></use>
                    </svg>
                    <div class="name">好友</div>
                    <div class="fontclass">#nj-haoyou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-huidaodingbu"></use>
                    </svg>
                    <div class="name">回到顶部</div>
                    <div class="fontclass">#nj-huidaodingbu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kefu"></use>
                    </svg>
                    <div class="name">客服</div>
                    <div class="fontclass">#nj-kefu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-mingxi"></use>
                    </svg>
                    <div class="name">明细</div>
                    <div class="fontclass">#nj-mingxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-lipinquan"></use>
                    </svg>
                    <div class="name">礼品券</div>
                    <div class="fontclass">#nj-lipinquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-peisongzhong"></use>
                    </svg>
                    <div class="name">配送中</div>
                    <div class="fontclass">#nj-peisongzhong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-quanbudingdan"></use>
                    </svg>
                    <div class="name">全部订单</div>
                    <div class="fontclass">#nj-quanbudingdan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-saoyisao"></use>
                    </svg>
                    <div class="name">扫一扫</div>
                    <div class="fontclass">#nj-saoyisao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-quanbufenlei"></use>
                    </svg>
                    <div class="name">全部分类</div>
                    <div class="fontclass">#nj-quanbufenlei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shaixuan"></use>
                    </svg>
                    <div class="name">筛选</div>
                    <div class="fontclass">#nj-shaixuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shanchu"></use>
                    </svg>
                    <div class="name">删除</div>
                    <div class="fontclass">#nj-shanchu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shangcheng"></use>
                    </svg>
                    <div class="name">商城</div>
                    <div class="fontclass">#nj-shangcheng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shijian"></use>
                    </svg>
                    <div class="name">时间</div>
                    <div class="fontclass">#nj-shijian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shezhi"></use>
                    </svg>
                    <div class="name">设置</div>
                    <div class="fontclass">#nj-shezhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shoucang"></use>
                    </svg>
                    <div class="name">收藏</div>
                    <div class="fontclass">#nj-shoucang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-sousuo"></use>
                    </svg>
                    <div class="name">搜索</div>
                    <div class="fontclass">#nj-sousuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tongyongquan"></use>
                    </svg>
                    <div class="name">通用券</div>
                    <div class="fontclass">#nj-tongyongquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-tongzhi"></use>
                    </svg>
                    <div class="name">通知</div>
                    <div class="fontclass">#nj-tongzhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-wode"></use>
                    </svg>
                    <div class="name">我的</div>
                    <div class="fontclass">#nj-wode</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xianghou"></use>
                    </svg>
                    <div class="name">向后</div>
                    <div class="fontclass">#nj-xianghou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiangshang"></use>
                    </svg>
                    <div class="name">向上</div>
                    <div class="fontclass">#nj-xiangshang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xuanzhong"></use>
                    </svg>
                    <div class="name">选中</div>
                    <div class="fontclass">#nj-xuanzhong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiaoxi"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#nj-xiaoxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yiguanzhu"></use>
                    </svg>
                    <div class="name">已关注</div>
                    <div class="fontclass">#nj-yiguanzhu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yaoqinghaoyou"></use>
                    </svg>
                    <div class="name">邀请好友</div>
                    <div class="fontclass">#nj-yaoqinghaoyou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yiqianshou"></use>
                    </svg>
                    <div class="name">已签收</div>
                    <div class="fontclass">#nj-yiqianshou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yiqianshou1"></use>
                    </svg>
                    <div class="name">已签收1</div>
                    <div class="fontclass">#nj-yiqianshou1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yishoucang"></use>
                    </svg>
                    <div class="name">已收藏</div>
                    <div class="fontclass">#nj-yishoucang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yinhangqia"></use>
                    </svg>
                    <div class="name">银行卡</div>
                    <div class="fontclass">#nj-yinhangqia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhifubao"></use>
                    </svg>
                    <div class="name">支付宝</div>
                    <div class="fontclass">#nj-zhifubao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yinlian"></use>
                    </svg>
                    <div class="name">银联</div>
                    <div class="fontclass">#nj-yinlian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-peisongzhong1"></use>
                    </svg>
                    <div class="name">配送中1</div>
                    <div class="fontclass">#nj-peisongzhong1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shouhuoren"></use>
                    </svg>
                    <div class="name">收货人</div>
                    <div class="fontclass">#nj-shouhuoren</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-lingjian"></use>
                    </svg>
                    <div class="name">零件</div>
                    <div class="fontclass">#nj-lingjian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-bangzhu"></use>
                    </svg>
                    <div class="name">帮助</div>
                    <div class="fontclass">#nj-bangzhu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-baoyang"></use>
                    </svg>
                    <div class="name">保养</div>
                    <div class="fontclass">#nj-baoyang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-weixiu"></use>
                    </svg>
                    <div class="name">维修</div>
                    <div class="fontclass">#nj-weixiu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhuangpei"></use>
                    </svg>
                    <div class="name">装配</div>
                    <div class="fontclass">#nj-zhuangpei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-youjiantou"></use>
                    </svg>
                    <div class="name">右箭头</div>
                    <div class="fontclass">#nj-youjiantou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cheliang"></use>
                    </svg>
                    <div class="name">车辆</div>
                    <div class="fontclass">#nj-cheliang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fangwei"></use>
                    </svg>
                    <div class="name">防伪</div>
                    <div class="fontclass">#nj-fangwei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yizhifu"></use>
                    </svg>
                    <div class="name">翌支付</div>
                    <div class="fontclass">#nj-yizhifu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fuwu"></use>
                    </svg>
                    <div class="name">服务</div>
                    <div class="fontclass">#nj-fuwu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fanhui1"></use>
                    </svg>
                    <div class="name">返回2</div>
                    <div class="fontclass">#nj-fanhui1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gongyingshang"></use>
                    </svg>
                    <div class="name">供应商</div>
                    <div class="fontclass">#nj-gongyingshang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-hezuoshang"></use>
                    </svg>
                    <div class="name">合作商</div>
                    <div class="fontclass">#nj-hezuoshang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-daijiesuan"></use>
                    </svg>
                    <div class="name">待结算</div>
                    <div class="fontclass">#nj-daijiesuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-anzhuang"></use>
                    </svg>
                    <div class="name">安装</div>
                    <div class="fontclass">#nj-anzhuang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiesuan"></use>
                    </svg>
                    <div class="name">结算</div>
                    <div class="fontclass">#nj-jiesuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiesuan1"></use>
                    </svg>
                    <div class="name">结算3</div>
                    <div class="fontclass">#nj-jiesuan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiesuan2"></use>
                    </svg>
                    <div class="name">结算2</div>
                    <div class="fontclass">#nj-jiesuan2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jifen"></use>
                    </svg>
                    <div class="name">积分</div>
                    <div class="fontclass">#nj-jifen</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jinrong"></use>
                    </svg>
                    <div class="name">金融</div>
                    <div class="fontclass">#nj-jinrong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kucun"></use>
                    </svg>
                    <div class="name">库存2</div>
                    <div class="fontclass">#nj-kucun</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jinrong1"></use>
                    </svg>
                    <div class="name">金融2</div>
                    <div class="fontclass">#nj-jinrong1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jinrong2"></use>
                    </svg>
                    <div class="name">金融3</div>
                    <div class="fontclass">#nj-jinrong2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kucun1"></use>
                    </svg>
                    <div class="name">库存</div>
                    <div class="fontclass">#nj-kucun1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jingxiaoshang"></use>
                    </svg>
                    <div class="name">经销商</div>
                    <div class="fontclass">#nj-jingxiaoshang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-pifa"></use>
                    </svg>
                    <div class="name">批发</div>
                    <div class="fontclass">#nj-pifa</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-mendian"></use>
                    </svg>
                    <div class="name">门店</div>
                    <div class="fontclass">#nj-mendian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kucun2"></use>
                    </svg>
                    <div class="name">库存3</div>
                    <div class="fontclass">#nj-kucun2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yuyue"></use>
                    </svg>
                    <div class="name">预约</div>
                    <div class="fontclass">#nj-yuyue</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhangben"></use>
                    </svg>
                    <div class="name">账本</div>
                    <div class="fontclass">#nj-zhangben</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhandian"></use>
                    </svg>
                    <div class="name">站点</div>
                    <div class="fontclass">#nj-zhandian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yuchai"></use>
                    </svg>
                    <div class="name">玉柴</div>
                    <div class="fontclass">#nj-yuchai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fengwo1"></use>
                    </svg>
                    <div class="name">蜂窝2</div>
                    <div class="fontclass">#nj-fengwo1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fengwo"></use>
                    </svg>
                    <div class="name">蜂窝</div>
                    <div class="fontclass">#nj-fengwo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-chuyi"></use>
                    </svg>
                    <div class="name">C 厨艺</div>
                    <div class="fontclass">#nj-chuyi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yilingqu"></use>
                    </svg>
                    <div class="name">已领取</div>
                    <div class="fontclass">#nj-yilingqu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xitongxiaoxi"></use>
                    </svg>
                    <div class="name">系统消息 </div>
                    <div class="fontclass">#nj-xitongxiaoxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-add"></use>
                    </svg>
                    <div class="name">添加</div>
                    <div class="fontclass">#nj-add</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dianzan"></use>
                    </svg>
                    <div class="name">点赞</div>
                    <div class="fontclass">#nj-dianzan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dianzan1"></use>
                    </svg>
                    <div class="name">点赞2</div>
                    <div class="fontclass">#nj-dianzan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cainixihuan"></use>
                    </svg>
                    <div class="name">猜你喜欢</div>
                    <div class="fontclass">#nj-cainixihuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-changwen"></use>
                    </svg>
                    <div class="name">常温</div>
                    <div class="fontclass">#nj-changwen</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cai"></use>
                    </svg>
                    <div class="name">踩</div>
                    <div class="fontclass">#nj-cai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-cai1"></use>
                    </svg>
                    <div class="name">踩2</div>
                    <div class="fontclass">#nj-cai1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shandian"></use>
                    </svg>
                    <div class="name">062闪电、急速</div>
                    <div class="fontclass">#nj-shandian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhongduanweixiu"></use>
                    </svg>
                    <div class="name">终端维修</div>
                    <div class="fontclass">#nj-zhongduanweixiu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-zhongduanchaichu"></use>
                    </svg>
                    <div class="name">终端拆除</div>
                    <div class="fontclass">#nj-zhongduanchaichu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiagouwuche"></use>
                    </svg>
                    <div class="name">加购物车</div>
                    <div class="fontclass">#nj-jiagouwuche</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jiancebaogao"></use>
                    </svg>
                    <div class="name">检测报告</div>
                    <div class="fontclass">#nj-jiancebaogao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dingwei"></use>
                    </svg>
                    <div class="name">定位02</div>
                    <div class="fontclass">#nj-dingwei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-changwen1"></use>
                    </svg>
                    <div class="name">常温02</div>
                    <div class="fontclass">#nj-changwen1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-pinpai1"></use>
                    </svg>
                    <div class="name">品牌02</div>
                    <div class="fontclass">#nj-pinpai1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-relian1"></use>
                    </svg>
                    <div class="name">热链</div>
                    <div class="fontclass">#nj-relian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-lengcang1"></use>
                    </svg>
                    <div class="name">冷藏2</div>
                    <div class="fontclass">#nj-lengcang1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-lengdong1"></use>
                    </svg>
                    <div class="name">冷冻</div>
                    <div class="fontclass">#nj-lengdong1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-qianbao1"></use>
                    </svg>
                    <div class="name">钱包</div>
                    <div class="fontclass">#nj-qianbao1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-huiyuanqia"></use>
                    </svg>
                    <div class="name">会员卡</div>
                    <div class="fontclass">#nj-huiyuanqia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-jifen1"></use>
                    </svg>
                    <div class="name">积分</div>
                    <div class="fontclass">#nj-jifen1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-lipin"></use>
                    </svg>
                    <div class="name">礼品</div>
                    <div class="fontclass">#nj-lipin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-youhuiquan"></use>
                    </svg>
                    <div class="name">优惠券</div>
                    <div class="fontclass">#nj-youhuiquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-down-trangle"></use>
                    </svg>
                    <div class="name">向下边框三角</div>
                    <div class="fontclass">#nj-down-trangle</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-suyuan"></use>
                    </svg>
                    <div class="name">溯源</div>
                    <div class="fontclass">#nj-suyuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dingdan1"></use>
                    </svg>
                    <div class="name">订单</div>
                    <div class="fontclass">#nj-dingdan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-huiyuanquanyi"></use>
                    </svg>
                    <div class="name">会员权益</div>
                    <div class="fontclass">#nj-huiyuanquanyi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouxuan1"></use>
                    </svg>
                    <div class="name">勾选</div>
                    <div class="fontclass">#nj-gouxuan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yaoqing"></use>
                    </svg>
                    <div class="name">邀请</div>
                    <div class="fontclass">#nj-yaoqing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-caidan1"></use>
                    </svg>
                    <div class="name">菜单</div>
                    <div class="fontclass">#nj-caidan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dizhi1"></use>
                    </svg>
                    <div class="name">地址</div>
                    <div class="fontclass">#nj-dizhi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-dingwei1"></use>
                    </svg>
                    <div class="name">定位</div>
                    <div class="fontclass">#nj-dingwei1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-goback"></use>
                    </svg>
                    <div class="name">返回</div>
                    <div class="fontclass">#nj-goback</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-faxian2"></use>
                    </svg>
                    <div class="name">发现2</div>
                    <div class="fontclass">#nj-faxian2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-faxian1"></use>
                    </svg>
                    <div class="name">发现</div>
                    <div class="fontclass">#nj-faxian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fuwuzhongxin"></use>
                    </svg>
                    <div class="name">服务中心</div>
                    <div class="fontclass">#nj-fuwuzhongxin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenlei2"></use>
                    </svg>
                    <div class="name">分类2</div>
                    <div class="fontclass">#nj-fenlei2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-fenlei1"></use>
                    </svg>
                    <div class="name">分类</div>
                    <div class="fontclass">#nj-fenlei1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouwuche2"></use>
                    </svg>
                    <div class="name">购物车2</div>
                    <div class="fontclass">#nj-gouwuche2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-kefu1"></use>
                    </svg>
                    <div class="name">客服</div>
                    <div class="fontclass">#nj-kefu1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouwuche1"></use>
                    </svg>
                    <div class="name">购物车</div>
                    <div class="fontclass">#nj-gouwuche1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-mendian1"></use>
                    </svg>
                    <div class="name">门店</div>
                    <div class="fontclass">#nj-mendian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-qiandao"></use>
                    </svg>
                    <div class="name">签到</div>
                    <div class="fontclass">#nj-qiandao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shouye1"></use>
                    </svg>
                    <div class="name">首页2</div>
                    <div class="fontclass">#nj-shouye1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-quanyi"></use>
                    </svg>
                    <div class="name">权益</div>
                    <div class="fontclass">#nj-quanyi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shouye"></use>
                    </svg>
                    <div class="name">首页</div>
                    <div class="fontclass">#nj-shouye</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-shezhi1"></use>
                    </svg>
                    <div class="name">设置</div>
                    <div class="fontclass">#nj-shezhi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-sousuo1"></use>
                    </svg>
                    <div class="name">搜索</div>
                    <div class="fontclass">#nj-sousuo1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-wode2"></use>
                    </svg>
                    <div class="name">我的2</div>
                    <div class="fontclass">#nj-wode2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiaoxi2"></use>
                    </svg>
                    <div class="name">消息</div>
                    <div class="fontclass">#nj-xiaoxi2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-wode1"></use>
                    </svg>
                    <div class="name">我的</div>
                    <div class="fontclass">#nj-wode1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-guanbi1"></use>
                    </svg>
                    <div class="name">关闭</div>
                    <div class="fontclass">#nj-guanbi1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gouwuqia"></use>
                    </svg>
                    <div class="name">充值</div>
                    <div class="fontclass">#nj-gouwuqia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-qianbao"></use>
                    </svg>
                    <div class="name">钱包</div>
                    <div class="fontclass">#nj-qianbao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-gonghang"></use>
                    </svg>
                    <div class="name">工行</div>
                    <div class="fontclass">#nj-gonghang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-weifutong"></use>
                    </svg>
                    <div class="name">威付通</div>
                    <div class="fontclass">#nj-weifutong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xianjin"></use>
                    </svg>
                    <div class="name">现金</div>
                    <div class="fontclass">#nj-xianjin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-weixin"></use>
                    </svg>
                    <div class="name">微信</div>
                    <div class="fontclass">#nj-weixin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yinlian2"></use>
                    </svg>
                    <div class="name">银联</div>
                    <div class="fontclass">#nj-yinlian2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-yinlian1"></use>
                    </svg>
                    <div class="name">银联2</div>
                    <div class="fontclass">#nj-yinlian1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-youhuiquan1"></use>
                    </svg>
                    <div class="name">优惠券</div>
                    <div class="fontclass">#nj-youhuiquan1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-mendian3"></use>
                    </svg>
                    <div class="name">门店 (2)</div>
                    <div class="fontclass">#nj-mendian3</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-logo1"></use>
                    </svg>
                    <div class="name">logo2</div>
                    <div class="fontclass">#nj-logo1</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-logo2"></use>
                    </svg>
                    <div class="name">logo</div>
                    <div class="fontclass">#nj-logo2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#nj-xiangpu"></use>
                    </svg>
                    <div class="name">象普</div>
                    <div class="fontclass">#nj-xiangpu</div>
                </li>
            
        </ul>


        <h2 id="symbol-">symbol引用</h2>
        <hr>

        <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
        这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点：</p>
        <ul>
          <li>支持多色图标了，不再受单色限制。</li>
          <li>通过一些技巧，支持像字体那样，通过<code>font-size</code>,<code>color</code>来调整样式。</li>
          <li>兼容性较差，支持 ie9+,及现代浏览器。</li>
          <li>浏览器渲染svg的性能一般，还不如png。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-symbol-">第一步：引入项目下面生成的symbol代码：</h3>
        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;</span></code></pre>
        <h3 id="-css-">第二步：加入通用css代码（引入一次就行）：</h3>
        <pre><code class="lang-js hljs javascript">&lt;style type=<span class="hljs-string">"text/css"</span>&gt;
.icon {
   width: <span class="hljs-number">1</span>em; height: <span class="hljs-number">1</span>em;
   vertical-align: <span class="hljs-number">-0.15</span>em;
   fill: currentColor;
   overflow: hidden;
}
&lt;<span class="hljs-regexp">/style&gt;</span></code></pre>
        <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-js hljs javascript">&lt;svg <span class="hljs-class"><span class="hljs-keyword">class</span></span>=<span class="hljs-string">"icon"</span> aria-hidden=<span class="hljs-string">"true"</span>&gt;<span class="xml"><span class="hljs-tag">
  &lt;<span class="hljs-name">use</span> <span class="hljs-attr">xlink:href</span>=<span class="hljs-string">"#nj-xxx"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">use</span>&gt;</span>
</span>&lt;<span class="hljs-regexp">/svg&gt;
        </span></code></pre>
    </div>
</body>
</html>
